// 外围遮罩
export default {
    data() {
        return {
        }
    },
    computed: {
        basin() {
            return this.$store.getters.basin
        }
    },
    watch: {
        basin: {
            handler: function(name) {
                this.$nextTick(() => {
                    this.creatMB(name)
                })
            },
            immediate: true
        }
    },
    beforeDestroy() {
        this.clearMB()
    },
    created() {
        this._entitiesMB = null
    },
    methods: {
        creatMB() {
            this.clearMB()
            if (this.layerList2[1].children.MB.show) {
                var url = `${mapConfig.resUrlPre}/geojson/${this.basin}/WATAM.json`
                this.$axios.get(url).then(res => {
                    var lonlats = []

                    var coordinates = res.data.features[0].geometry.coordinates[0]
                    coordinates.forEach(coordinate => {
                        lonlats.push(coordinate[0])
                        lonlats.push(coordinate[1])
                    })
                    var polylineEntity = {
                        polygon: {
                            hierarchy: {
                                // 扩展
                                positions: Cesium.Cartesian3.fromDegreesArray([
                                    80.0,
                                    10.0,
                                    140.0,
                                    10.0,
                                    140.0,
                                    50.0,
                                    80.0,
                                    50.0
                                ]),
                                holes: [
                                    {
                                        positions: Cesium.Cartesian3.fromDegreesArray(lonlats)
                                    }
                                ]
                            },
                            outline: true,
                            outlineColor: Cesium.Color.fromCssColorString('rgb(255,219,19)'),
                            outlineWidth: 12,
                            material: Cesium.Color.fromCssColorString('rgba(1,1,1,0.5)')
                        }
                    }
                    this._entitiesMB = this.$viewer.entities.add(polylineEntity)
                })
                // 边界不够大
                // this.$viewer.dataSources.add(Cesium.GeoJsonDataSource.load(url, {
                //     stroke: Cesium.Color.fromCssColorString('rgb(255,219,19)'),
                //     fill: Cesium.Color.fromCssColorString('rgba(1,1,1,0.68)'),
                //     strokeWidth: 3,
                //     clampToGround: true
                // }))
            } else {
                this.clearMB()
            }
        },

        clearMB() {
            if (this._entitiesMB) {
                this.$viewer.entities.remove(this._entitiesMB)
                this._entitiesMB = null
            }
        }
    }
}
